<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>MarkMeditor Demo</title>

    <link rel="stylesheet" href="assert/codemirror/codemirror.css">
    <link rel="stylesheet" href="assert/codemirror/theme/neo.css">
    <link rel="stylesheet" href="assert/codemirror/theme/base16-light.css">
    <link rel="stylesheet" href="assert/highlight/styles/docco.css"/>

    <link rel="stylesheet" type="text/css" href="assert/bootstrap/css/bootstrap.min.css">

    <link rel="stylesheet" href="dist/css/markmeditor.min.css">

    <style>
        body{
            font-family: Georgia, "courier new", courier, Consolas, monaco;
            max-width: 1024px;
            margin-top: 10px;
            margin:0 auto;
        }
    </style>
</head>
<body>

<div class="container">
    <div>
        <h2>Welcome using MarkMeditor</h2>
    </div>

<form action="">
    <div style="position:relative;">
        <textarea id="markme-editor" placeholder="在这里，尽情书写，开启快乐之行！"></textarea>
    </div>
</form>

    <div>
        <br>
        <button type="button" class="btn" id="mdBtn">获取MarkDown</button>
        <button type="button" class="btn" id="htmlBtn">获取HTML</button>
    </div>

    <div>
        <br>
        <pre><code class="language-javascript">
var txt = $('#markme-editor').markmeditor({height: 600, useHash: true, theme: 'base16-light'});
        </code></pre>
    </div>

    <div>
        <br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br>
        <br><br><br><br><br><br><br><br>

        <div class="well well-sm">
            底部
        </div>
    </div>
</div>

<script type="text/javascript" src="assert/jquery/jquery-1.11.3.js"></script>
<script type="text/javascript" src="assert/fileupload/fileupload.js"></script>

<script type="text/javascript" src="assert/markdown-it/markdown-it.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-abbr/markdown-it-abbr.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-container/markdown-it-container.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-deflist/markdown-it-deflist.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-emoji/markdown-it-emoji.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-footnote/markdown-it-footnote.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-ins/markdown-it-ins.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-mark/markdown-it-mark.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-sub/markdown-it-sub.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-sup/markdown-it-sup.min.js"></script>
<script type="text/javascript" src="assert/markdown-it-task-lists/markdown-it-task-lists.min.js"></script>

<script type="text/javascript" src="assert/codemirror/codemirror.js"></script>
<script type="text/javascript" src="assert/codemirror/util/continuelist.js"></script>
<script type="text/javascript" src="assert/codemirror/util/gfm.js"></script>
<script type="text/javascript" src="assert/codemirror/util/overlay.js"></script>
<script type="text/javascript" src="assert/codemirror/mode/markdown.js"></script>
<script type="text/javascript" src="assert/codemirror/addon/placeholder.js"></script>

<script type="text/javascript" src="assert/rawflate/rawdeflate.js"></script>
<script type="text/javascript" src="assert/rawflate/rawinflate.js"></script>

<script type="text/javascript" src="assert/highlight/highlight.pack.min.js"></script>

<script type="text/javascript" src="assert/popper/popper.min.js"></script>
<script type="text/javascript" src="assert/bootstrap/js/bootstrap.min.js"></script>

<script type="text/javascript" src="dist/js/markmeditor.min.js"></script>
<script type="text/javascript" src="index.js"></script>

<script type="text/javascript">
    var txt = $('#markme-editor').markmeditor({
        height: 600,
        uploadPath: 'http://localhost:8080/upload/markmeditor/picture.html',
        useHash: true,
        theme: 'base16-light',
        useMarkdownitEmoji: true
    });
</script>
</body>
</html>
